.activity_editor {
  .header {
    height: 50px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 24px;
    box-sizing: border-box;

    .header_left {
      display: flex;
      align-items: center;
      font-family: PingFang SC;

      .header_left_title {
        color: #1d2129;
        font-size: 20px;
        font-style: normal;
        font-weight: 500;
        line-height: 28px;
      }

      .header_left_subtitle {
        color: #86909c;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 22px;
        margin-left: 8px;
      }
    }

    .header_right {
      display: flex;
    }
  }

  .wrapper {
    display: flex;
    justify-content: space-between;
    background: #f0f0f0;
    height: calc(100vh - 106px);

    .applet_view {
      width: 375px;
      background: #f6f8f9;
      margin-top: 3%;
      margin-bottom: 3%;
      overflow-y: scroll;
      overflow: hidden;
      background: #ff6787;
      transition: background 0.3s;

      .applet_view_status {
        width: 100%;
        height: 44px;
        background: url('@/assets/images/phoneStatus.svg') no-repeat;
        background-size: 100% 100%;
      }

      .applet_view_title {
        height: 56px;
        width: 100%;
        background: #fff;
        position: relative;

        .applet_view_title_text {
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%, -50%);
        }

        .applet_view_title_btn {
          position: absolute;
          right: 0;
          top: 50%;
          transform: translateY(-50%);
          width: 100px;
          height: 32px;
          background: url('@/assets/images/appletBtn.svg') no-repeat;
        }
      }

      .applet_view_content {
        overflow-y: scroll;
        padding-bottom: 130px;
        height: 100%;

        .applet_view_header {
          // background: url('https://qny.weizulin.cn/images/202404161048493.png') no-repeat;
          background-repeat: no-repeat;
          height: 275px;
          width: 100%;
          background-size: 100% 100%;
          margin-bottom: -75px;
          position: relative;
        }

        .coupon_list {
          width: 100%;
          .coupon_box {
            width: 90%;
            margin: 0 auto;
            position: relative;
            z-index: 99;
            background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, #fff 100%);
            border-radius: 11px;
            padding: 20px 10px;
            box-sizing: border-box;

            .coupon_item {
              width: 100%;
              background: url('https://qny.weizulin.cn/images/202404161048492.png') no-repeat;
              background-size: 100% 100%;
              height: 100px;
              border-radius: 15px;
              padding: 5px;
              box-sizing: border-box;
              margin-bottom: 15px;
              display: flex;
              align-items: center;
              position: relative;

              &:last-child {
                margin-bottom: 0;
              }

              .tag {
                color: #fff;
                border-radius: 12px 0 12px 0;
                padding: 2px 7px;
                font-size: 10px;
                display: inline-block;
                background: linear-gradient(270deg, #ff0070 0%, #ff570d 100%), #ffffff;
                position: absolute;
                top: 5px;
                left: 5px;
              }

              .price_box {
                font-family: DINPro;
                font-weight: bold;
                font-size: 20px;
                color: #ff1c00;
                width: 90px;
                height: 90px;
                line-height: 90px;
                text-align: left;
                padding-left: 12px;
                box-sizing: border-box;

                span {
                  font-size: 15px;
                }
              }

              .coupon_item_info {
                padding-left: 10px;
                box-sizing: border-box;
                width: 140px;

                .name {
                  font-family: PingFangSC, PingFang SC;
                  font-weight: 600;
                  font-size: 15px;
                  color: #592424;
                  line-height: 15px;
                }

                .content,
                .time {
                  font-family: PingFangSC, PingFang SC;
                  font-weight: 400;
                  font-size: 10px;
                  color: #ab8888;
                  line-height: 10px;
                }

                .content {
                  margin: 10px 0;
                }
              }

              .coupon_item_btn {
                flex: 1;
                display: flex;
                justify-content: center;

                div {
                  margin-left: 7px;
                  width: 55px;
                  height: 27px;
                  background: linear-gradient(180deg, #ffffff 0%, #ffc5d0 100%);
                  border-radius: 13px;
                  font-family: PingFangSC, PingFang SC;
                  font-weight: 600;
                  font-size: 13px;
                  color: #fe3550;
                  line-height: 27px;
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  cursor: pointer;
                }
              }
            }

            .coupon_item_disabled {
              & {
                opacity: 1;
              }

              .coupon_item_btn {
                div {
                  color: #c898a4;
                }
              }
            }
          }
        }
        .goods_list {
          width: 100%;
          .goods_box {
            width: 90%;
            margin: 0 auto;
            background: rgba(255, 255, 255, 0.5);
            margin-top: 10px;
            border-radius: 11px;
            position: relative;
            z-index: 99;

            .goods_header {
              width: 100%;
              height: 75px;
              background: url('https://qny.weizulin.cn/images/202404161126773.png') no-repeat;
              background-size: 100% 100%;
              margin-bottom: -30px;
            }

            .goods_content {
              margin: 0 auto;
              padding: 10px;

              .goods_item {
                width: 100%;
                display: flex;
                align-items: center;
                margin-bottom: 10px;

                &:last-child {
                  margin-bottom: 0;
                }

                .goods_main_info,
                .goods_sub_info {
                  height: 125px;
                  border-radius: 8px;
                }

                .goods_main_info {
                  width: 130px;
                  background: #f5f5f5;
                  border-right: 1px dashed red;
                  position: relative;
                  display: flex;
                  align-items: center;
                  justify-content: center;

                  .goods_tag {
                    color: #fff;
                    border-radius: 7.5px 0 7.5px 0;
                    padding: 2.5px 7.5px;
                    font-size: 10px;
                    display: inline-block;
                    background: linear-gradient(270deg, #ff0070 0%, #ff570d 100%), #ffffff;
                    position: absolute;
                    top: 5px;
                    left: 5px;
                  }

                  .goods_img {
                    width: 110px;
                    height: 110px;
                    vertical-align: bottom;
                    margin-top: 5px;
                    object-fit: contain;
                  }
                }

                .goods_sub_info {
                  width: 205px;
                  background: #fff;
                  padding: 10px;
                  box-align: border-box;
                  position: relative;

                  .goods_name {
                    width: 175px;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 500;
                    font-size: 14px;
                    color: #000000;
                    line-height: 20px;
                    text-align: left;
                    font-style: normal;
                    // 超出两行显示省略号
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                  }

                  .goods_price {
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 500;
                    font-size: 13px;
                    color: #ff1c00;
                    line-height: 20px;
                    text-align: left;
                    font-style: normal;
                    position: absolute;
                    bottom: 45px;

                    span {
                      font-size: 19px;
                    }
                  }

                  .goods_btn {
                    width: 75px;
                    height: 24px;
                    background: #fe3550;
                    border-radius: 13.5px;
                    color: #fff;
                    font-size: 14px;
                    text-align: center;
                    line-height: 24px;
                    position: absolute;
                    bottom: 10px;
                  }
                }
              }
            }
          }
        }
      }
    }

    .com_attr {
      width: 500px;
      background: #fff;
      box-sizing: border-box;
      overflow: auto;
      .com_tip_text {
        background-color: #fff;
        padding: 0 20px;
        box-sizing: border-box;
        .com_tip_title {
          color: #333;
        }
        .com_tip_content {
          color: #888f9a;
        }
      }

      .ant-collapse-content-box {
        background-color: #fff;
      }
    }
  }
}

.activity_loading {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  height: 100vh;
  color: #4d76fb;
}
